<ion-header class="borrow-order-header">
  <ion-navbar hideBackButton="true">

    <ion-buttons start navPop class="back-buttons">
      <button ion-button clear></button>
    </ion-buttons>

    <ion-title float-left>借款记录</ion-title>

  </ion-navbar>
</ion-header>

<ion-content class="borrow-order-section">

  <!--没有需要归还的页面-->
  <div class="show-not-back"
       *ngIf="orderList$ | async as orderList"
       [hidden]="orderList.length>0"
  >
    <div></div>
    <p>你现在还没有借款记录哦~</p>
  </div>

  <!-- 订单条目 -->
  <ion-list *ngIf="orderList$ | async as orderList"
            [hidden]="orderList.length===0">
    <ion-item-sliding *ngFor="let item of orderList">

      <ion-item (click)="doOrderDetails(item)">
        <!-- 纯文本展示
        -->
        <ion-card>
          <ion-card-header>{{item['trade']['title']}}</ion-card-header>
          <!-- 底部显示标签
          -->
          <ion-row>

            <ion-col>
              <div class="time-load">{{item['trade']['state']}}</div>
            </ion-col>

            <ion-col>
              <!--<div class="time-load">离还款(天):5</div>-->

            </ion-col>

            <ion-col>
              <div>{{item['trade']['time'] | date:'yyyy-mm-dd HH:mm:ss'}}</div>
            </ion-col>
          </ion-row>

        </ion-card>
      </ion-item>


    </ion-item-sliding>
  </ion-list>


  <ion-refresher (ionRefresh)="executeRefresh($event)">
    <ion-refresher-content></ion-refresher-content>
  </ion-refresher>

</ion-content>
